import React, {Component} from 'react';
import {Switch, Route,Redirect} from 'react-router-dom'
import Cookies from 'js-cookie'
import {connect} from 'react-redux'
import {NavBar} from 'antd-mobile'


import {faEnvelope,faUser,faHome} from "@fortawesome/fontawesome-free-solid";

import AdminInfo from '../admin-info/admin-info'
import UserInfo from '../user-info/user-info'
import Admin from '../admin-info/admin-list'
import User from '../user-info/user-list'
import Message from '../message/message'
import Personal from '../personal/personal'
import Error from '../../components/error/error'
import NavFooter from '../../components/nav-footer/nav-footer'
import Chat from '../../containers/chat/chat'

import {getUser} from '../../redux/actions'
import {getRedirectPath} from '../../utils'

class Main extends Component {
    navList = [
        {
            path:'/admin',
            component:Admin,
            title:'管理员列表',
            icon:faHome,
            text:'管理员'
        },
        {
            path:'/user',
            component:User,
            title:'用户列表',
            icon:faHome,
            text:'用户'
        },
        {
            path:'/message',
            component:Message,
            title:'消息列表',
            icon:faEnvelope,
            text:'消息'
        },
        {
            path:'/personal',
            component:Personal,
            title:'用户中心',
            icon:faUser,
            text:'个人'
        },
    ]


    componentDidMount(){
        let userid = sessionStorage.getItem('userid')
        let {user} = this.props
        if(userid && !user._id){
            this.props.getUser({userid:userid})
        }
    }
    render() {
        let pathname = this.props.location.pathname
        let userid = Cookies.get('userid')
        if (!userid) {
            return <Redirect to='/login'></Redirect>
        }
        let {user} = this.props

        if(!user._id){
            return null
        }else {
            if(pathname === '/') {
                let path = getRedirectPath(user.type,user.header)
                return <Redirect to={path}></Redirect>
            }
            if(user.type === 'admin'){
                this.navList[1].hide = true
            }else {
                this.navList[0].hide = true
            }
        }

        let currentNav = this.navList.find( nav => nav.path === pathname)
        let unReadCount = this.props.unReadCount

        return (
            <div>
                {currentNav ? <NavBar className='stick-top'>{currentNav.title}</NavBar> : null}
                <Switch >
                    { this.navList.map( nav => <Route key={nav.path} path={nav.path} component={nav.component}> </Route>)}
                    <Route path='/admininfo' component={AdminInfo}> </Route>
                    {/*<Route path='/user' component={User}> </Route>*/}
                    <Route path='/userinfo' component={UserInfo}> </Route>
                    <Route path='/chat/:userid' component={Chat}> </Route>
                    <Route component={Error}> </Route>
                </Switch>
                {currentNav ? <NavFooter  unReadCount={unReadCount} navList={this.navList}></NavFooter> : null}
            </div>
        );
    }
}

export default connect(
    state => ({user:state.user,unReadCount:state.chat.unReadCount}),
    {getUser}
)(Main);